<template>
  <div class="link-manager-div">
    <modal-dialog :width="width" :height="height" :modal="false" @close="onCancel">
      <div slot="header" class="c-header">{{ title }}</div>
      <div slot="body" class="c-body">
        <!-- 巷道表格组件 -->
        <edge-table :object-ids="parts" toolbar-id="link-manager-dialog" />
      </div>
      <!-- <div slot="footer" style="heiight:100%;">
        <el-button type="text" @click.native="onCancel">关闭</el-button>
      </div>-->
    </modal-dialog>
  </div>
</template>

<script>
import ModalDialog from '@/components/ModalDialog'
import EdgeTable from '@/views/editor/components/edge-table'

export default {
  components: { ModalDialog, EdgeTable },
  props: {
    width: {
      type: Number,
      required: false,
      default: 400
    },
    height: {
      type: Number,
      required: false,
      default: 480
    },
    title: {
      type: String,
      required: false,
      default: '巷道列表'
    },
    parts: {
      type: Array,
      required: true,
      default: () => []
    }
  },
  data() {
    return {}
  },
  methods: {
    // 点击右上角"关闭"按钮
    onCancel() {
      // 关闭对话框
      this.$close()
    }
  }
}
</script>

<style lang="scss">
// @import '../../style/variable.scss';

.link-manager-div {
  .dialog-body {
    // @import '../../style/form.scss';

    .c-body {
      // padding: 0px 2px;
      height: 100%;
      overflow: hidden;
    }
  }
  .dialog-footer {
    // 隐藏对话框footer
    display: none !important;
    // @import '../../style/form.scss';
    // .el-button {
    //   font-size: 16px !important;
    //   margin-top: 5px !important;
    // }
  }
}
</style>
